
{% load static %}

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">

    <!-- ChartJS -->
    <link rel="stylesheet" href="{% static 'css/Chart.min.css' %}">

    <!-- FontAwesome -->
    <link rel="stylesheet" href="{% static 'css/fontawesome.all.min.css' %}">

    <title>Welcome to GeekLab!</title>
</head>

<body>

{% include 'authapp/includes/inc_messages.html' %}

<div class="row justify-content-around align-items-center" style="height: 100vh; margin: 0px">
    <div class="text-center">
        <p>
            <a href="{% url 'mainapp:home' %}"><img src="{% static 'img/logo.png' %}" alt=""></a>
        </p>
        <h2>{{title }}</h2>
        {% block content %}
        {% endblock %}
        </p>
        <h4>Вход через социальные сети</h4>
        <p>
        <div class="btn-group btn-block" role="group">
            <a class="btn btn-primary" href="#" role="button"><i class="fab fa-vk"></i></a>
            <a class="btn btn-primary" href="{% url 'social:begin' 'github' %}" role="button"><i class="fab fa-github"></i></a>
            <a class="btn btn-primary" href="#" role="button"><i class="fab fa-facebook"></i></a>
        </div>
        </p>
    </div>
</div>

<!-- Footer -->

<!-- /Footer -->

<!-- JavaScript section -->
<!-- Bootstrap -->
<script src="{% static 'js/jquery-3.6.0.min.js' %}"></script>
<script src="{% static 'js/popper.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>

<!-- ChartJs -->
<script src="{% static 'js/Chart.min.js' %}"></script>

<!-- FontAwesome -->
<script src="{% static 'js/fontawesome.all.min.js' %}"></script>

{% block js %}
        <script>
            $(document).ready(function () {

                {% if messages %}

                // Toasts
                $(".toast").toast({ delay: 5000 });
                $(".toast").toast("show");

                {% endif %}

                });
        </script>

{% endblock %}

    </body>
</html>

